<nav class="navbar navbar-expand-lg navbar-light bg-light navbar-static-top">
    <div class="container">
        <!-- Branding Image -->
        <a class="navbar-brand " href="{{ url('/') }}">
            Luntan1
        </a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
                aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse justify-content-between" id="navbarSupportedContent">
            <!-- Left Side Of Navbar -->
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link {{active_class(if_route('topic.index'))}}"
                       href="{{route('topics.index')}}">帖子</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link
                    {{ category_nav_active(1) }}"
                       href="{{route('categories.show',1)}}">
                        分享
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link
                      {{ category_nav_active(2) }}" href="{{route('categories.show',2)}}">教程</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link
                        {{ category_nav_active(3) }}" href="{{route('categories.show',3)}}">问答</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link
                    {{ category_nav_active(4) }}
                    " href="{{route('categories.show',4)}}">公告</a>
                </li>
            </ul>

            <!-- Right Side Of Navbar -->
            <ul class="navbar-nav navbar-right">
                <!-- Authentication Links -->
                @guest
                    <li class="nav-item"><a class="nav-link" href="{{route('login')}}">登录</a></li>
                    <li class="nav-item"><a class="nav-link" href="{{route('register')}}">注册</a></li>
                @else
                    <li class="nav-item d-flex align-items-center">
                        <a class="nav-link" href="{{route('topics.create')}}">
                            <i class="fa fa-solid fa-plus"></i>
                        </a>
                    </li>
                    <li class="nav-item d-flex align-items-center">
                        <a class="nav-link" href="{{route('notifications.index')}}">
                            <span
                                class="badge rounded-pill text-bg-{{Auth::user()->notification_count > 0 ? 'danger' : 'secondary'}}">
                                {{Auth::user()->notification_count}}
                            </span>
                        </a>
                    </li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
                           data-bs-toggle="dropdown"
                           aria-haspopup="true" aria-expanded="false">
                            <img src="{{Auth::user()->avatar}}"
                                 class="img-responsive img-circle rounded-1 " style="border:2px solid deeppink;"
                                 width="30px" height="30px">
                            {{ Auth::user()->name }}
                        </a>
                        <div class="dropdown-menu text-center" aria-labelledby="navbarDropdown">
                            @can('manage_contents')
                                <a class="dropdown-item" href="{{url(config('administrator.uri'))}}">
                                    <i class="fa fa-tachometer-alt"></i>
                                    后台管理
                                </a>
                            @endcan
                            <a class="dropdown-item" href="{{route('users.show',Auth::id())}}">
                                <i class="fa fa-user"></i>
                                个人中心
                            </a>
                            <a class="dropdown-item" href="{{route('users.edit',Auth::id())}}">
                                <i class="fa fa-edit"></i>
                                编辑资料
                            </a>
                            <div class="dropdown-divider"></div>
                            <a class="dropdown-item" id="logout" href="#">
                                <form action="{{ route('logout') }}" method="POST"
                                      onsubmit="return confirm('您确定要退出吗?')"
                                >
                                    {{ csrf_field() }}
                                    <button class="btn btn-block btn-danger" type="submit" name="button">退出</button>
                                </form>
                            </a>
                        </div>
                    </li>
                @endguest
            </ul>
        </div>
    </div>
</nav>
